<template >
    <div id="goods_cat2">
        <el-cascader
            v-model="goods_cat"
            :options="options"
            clearable
            style="width:100%"
            @change="handleChange"
            :props="{ expandTrigger: 'hover',value:'cat_id',label: 'cat_name',children: 'children',checkStrictly: true}">
            <template slot-scope="{ data }">
                <span>{{ data.cat_name }}</span>
            </template>
        </el-cascader>
    </div>
</template>
<script>
export default {
    name:'goods_cat2',
    data() {
        return {
            goods_cat: [],
            options:[]
        }
    },
    mounted(){
        //获取所有列表
        this.$store.dispatch('categorie/Acs_getCategories')
        .then(res=>{
                this.options=res;
                //console.log(res.filter(item=>{return item.chilren}));
            })
        .catch(err=>console.log(err))
    },
    methods:{
        handleChange(goods_cat) {
            console.log(goods_cat);
            this.$store.commit('categorie/CHANGE_GOODS_CAT',goods_cat)
        
    }
}
}
</script>
<style lang="scss" scoped>
    
</style>

